<template>
	<view>
		<u-swiper :list="swiper" keyName="image" :indicator="true" indicatorMode="dot" :circular="true" @click="gopath">
		</u-swiper>
		<view class="link_box">
			<view class="link_item" @click="goSubMenu('瓜田趣事')">
				<image class="link_icon" src="/static/icon/icon01.png" mode="widthFix"></image>
				<view class="link_lable">瓜田趣事</view>
			</view>
			<view class="link_item" @click="goSubMenu('二手闲置')">
				<image class="link_icon" src="/static/icon/icon02.png" mode="widthFix"></image>
				<view class="link_lable">二手闲置</view>
			</view>
			<view class="link_item" @click="goSubMenu('表白交友')">
				<image class="link_icon" src="/static/icon/icon03.png" mode="widthFix"></image>
				<view class="link_lable">表白交友</view>
			</view>
			<view class="link_item" @click="goSubMenu('校园招聘')">
				<image class="link_icon" src="/static/icon/icon04.png" mode="widthFix"></image>
				<view class="link_lable">校园招聘</view>
			</view>
		</view>
		<view class="line"></view>
		<Article :tabList="tabList"></Article>
	</view>
</template>

<script>
	import Article from '@/compontents/Article.vue'


	export default {
		components: {
			Article,
		},
		props: {
			tabList: {
				type: Array,
				default: () => {
					return []
				}
			},
			swiper: {
				type: Array,
				default: () => {
					return []
				}
			}

		},
		created() {
			console.log('这里是组件的onShow');
			this.init()
		},


		methods: {

			init() {},

			goSubMenu(menu) {
				uni.navigateTo({
					url: '/pages/index/subMenu?menu=' + menu
				})
			},
			// 点击轮播图
			gopath(e) {
				console.log('点击轮播图', this.swiper[e]);
				if (this.swiper[e].imageUrl) {
					window.open(this.swiper[e].imageUrl)
				}

			},

		}
	}
</script>

<style lang="scss" scoped>
	.link_box {
		display: flex;
		align-items: center;
		justify-content: space-around;

		.link_item {
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			width: 100rpx;

			.link_icon {
				width: 84rpx;
			}

			.link_lable {
				font-weight: 500;
				font-size: 24rpx;
				color: #000000;
			}
		}
	}
</style>